<script setup>
import FHeader from "@/layouts/components/FHeader.vue";
import FMenu from "@/layouts/components/FMenu.vue";
import FTagList from "@/layouts/components/FTagList.vue";
import { useUserInfoStore } from "@/stores/userInfo.js";

const store = useUserInfoStore();
</script>

<template>
  <el-container>
    <el-header><f-header /></el-header>
    <el-container>
      <el-aside :width="store.asideWidth"><f-menu /></el-aside>
      <el-main>
        <f-tag-list />
        <router-view :key="$route.fullPath"></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>

<style scoped>
@import 'https://cdn.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css';

.el-aside {
  transition: all 0.2s;
}
</style>